import React from 'react';
import { useAuth } from '../contexts/AuthContext';

interface PermissionProps {
  allow: string[];
  disabledFallback?: React.ReactNode;
  children: React.ReactNode;
}

export function WithPermission({ allow, disabledFallback, children }: PermissionProps) {
  const { user } = useAuth();
  const allowed = !!user && allow.includes(user.role);

  if (!user) return null;
  if (!allowed) {
    return disabledFallback ?? null;
  }
  return <>{children}</>;
} 